<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /*
            1---周
                变量定义 var  let const 
                    var a = 1;
                    数据类型--数字 字符串 布尔值  null undefined  对象
               运算符 
                    算术运算符  + - * / % **
                    赋值运算符 a=1  += -= *= /= 
                    关系运算符  a>1  a<1  == === >= <= != !== 
                    逻辑运算符  && ||  !  
                    自增 ++ --  i++  ++i; 

               typeof 
               
               选择 判断 

                ****
                if(条件){  代码 } 
                if(条件){  代码 }else {} 
                if(条件){  代码 }else if(){} else {} 

                switch(变量){
                    case 值:代码;break;  
                    case 值:代码;break; 
                    default:
                        代码
                        break； 
                }


              循环
                while(条件){}  
                do{ }  while(条件) 
                for(var i=0;i<10;i++){
                    代码块  i 
                }

              函数
                定义函数
                    function box(a,b){
                        代码-函数体
                        return 返回值
                    }
                    var box = function(形参列表){
                         代码-函数体
                        return 返回值
                    }
                调用函数
                    box(实参1 ,2)


                    function fn(a){
                        arguments ->获取所有的实参
                    }
                    fn(1,4,4,56,6,3)

                    function fn(a,b,c){
                        b c 没有实参对应--值是undefined
                    }
                    fn(1)

              作用域
                 全局作用域  局部作用域（函数内部）
                    es6 let 和consnt  在代码块 内 if for 块级作用域 
                 var a = 1;    全局变了
                 function box(){
                    var b = 1;//局部
                 }     
                 if（1）{
                    var age = 1;//全局
                    let c = 1//局部
                 }

              使用var 定义的变量 声明提升--预解析 
              
              let const 没有 预解析

              递归

                 function box(){
                    box()
                 }

                 function sum(n){
                    if(n===1){
                        return 1;
                    }
                    return sum(n-1)+n;
                 }


           对象 
            let obj = {name:'zhangsan','age':11};
            let obj2 = new Object()  ->  {}
            obj2.name = 'zhangsn'
            obj2.run = function(){}
            delete obj2.run



          第二周
                 数组
                    let arr = new Array()
                    let arr2 = []

                 对象
                    属性
                        length 元素长度
                        下标-索引 从0开始
                            arr[0] 
                            arr[0] = 100;
                    循环遍历数组的元素和下标
                        var sum = 0
                        for(var i=0;i<arr.length;i++){
                            //i 下标
                            arr[i]//元素

                            sum = sum + arr[i];
                        }        
                    方法   
                        push
                        pop
                        unshift
                        shift
                        splice
                        reverse
                        sort

                        slice
                        join
                        concat
                        indexOf
                        lastIndexOf
                        includes

                        forEach
                        map
                        filter
                        some
                        every
                        find
                        findIndex
                        reduce
                        flat

                     数去去重
                        for
                        filter--》
                        reduce   
                        [...new Set(arr)]

                 基础类型和复杂类型的区别
                    基础类型直接存入栈中
                    复杂类型--地址存入栈，数据存入堆中
                    
                    基础类型赋值--值传递 a=b 没有关系
                    复杂类型赋值--地址传递 obj = obj2  同一个变量--同一个内存


                    是否为空数组  arr.length == 0 
                    [] === [] false
                    {} === {} false
                    基础类型 -比较 --只要长得一样 ，在一定相等 （除了symbol NaN）
                    复杂类型 比较--长得一样，也不不相等


                排序--
                    冒泡
                    选择


               字符串
                     创建 
                        new String
                        ''
                        ""
                        `bb ${变量} aa`   
                     属性-方法
                        length  下标 
                        
                     方法-
                        slice **
                        indexOf
                        includes
                        
                        split ***
                        replace
                        replaceAll
                        trim
                        toUpperCase toLowerCase 
                        search
                        match
                        startsWith
                        endsWith

                    拼接字符串
                        a + '11'
                        `aa${变量}`
                        arr.join('')     

        
          Math 数学对象 集成了 数学相关的属性和方法
                Math.PI
                Math.random 
                round
                ceil
                floor
                abs
                max(...arr)
                min
                pow
                sqrt
                sin
         Date 内置构造函数
            let d1 = new Date(日期字符串)
            let d1 = new Date(时间戳)
            let d1 = new Date(多个数-年月日) 月从0开始

            方法
                get 年 月日 时分秒 毫秒 时间戳 星期
                set 年 月日 时分秒 毫秒 时间戳

            时间差  
                        时间戳相减 --毫秒数--秒-分-小时
            格式化
                   获取 年月日  拼接字符串
                   
                   
                 效果：  倒计时
          ECMAScript 

         DOM    文档对象模型
               let div = document.querySelector('#box')         
               let divArr = document.querySelectorAll('div')  
               divArr.forEach
               
               属性
                    标准属性--dom.属性名  dom.属性名= 属性值
                    内容
                        ipt.value
                        div.innerHTML
                    样式
                        div.style.xxx = 'aaa'
                    类
                        div.className
                        div.classList
                    自定义属性
                        div.setAttribte(key,value)
                        div.getAttribte(key)
                        data-xxx
                        dataset.xxx
           dom树 
            节点对象---元素--属性--文本 

            dom CURD
                创建 creatElment
                添加 appendChild insertBefore 
                删除 remove  removeChild
                替换 repalceChild

         效果:
              倒计时
              选项卡--
              留言版--记住第二种思路--innerHTML 属性  arr的方法 拼接字符串--生成列表
                            数组的删除--splice filter--列表 
                            添加---push--列表


         BOM
             innerWidth Height 
             alert confirm prompt 
             location href  search  hash  
             histroy  go back foword
             navigator  userAgent 
             onload
             onscroll 
                -> document.documentElement.scrollTop           
                -> document.documentElement.scrollTo({})     
            setinerval 
            settimeout 
            
            localstorage.setItem(key,value)
            localstorage.getItem(key)
            localstorage.removeItem(key)

            sessionstorage.removeItem(key)

            JSON.stringify 对象转为json字符串
            JSON.parse json字符串转为js对象


            
            

          事件
               dom0 添加 
                dom.onclick = function(evt){
                    this->添加事件的元素
                    evt-》事件对象
                } 
                <button onclick="fn(1)">

                 dom.onclick = null   
               dom2 
                    dom.addEventListener('click',function(){},false)
                    dom.removeEventListener

              事件对象
                evt.target 
                evt.pageX Y 
                evt.clientX clientY 
                evt.offsetX Y 
                
                evt.keyCode ctrlKey shiftKey altKey

                 stop 阻止冒泡  冒泡-从内到外 
                 prevent阻止默认执行  

                 事件冒泡--事件委托--利用事件冒泡的原理 给父元素添加事件 监听子元素

                 常见的事件
                    click dblclick  mosuedown up move enter leave over out
                    change  input focus blur 

                keydown press up 
                
                留言 --- css下拉



          es6
               let const 
               箭头函数 
                let fn = ()=>{ }     
                let fn = a=>{ return a+1 }     
                let fn = a=>a+1  
                特点：没有自己的this 和 上下文一样--简写了函数
                        没有arguments 
                参数的默认值 function box(a = 1){}        
                解构赋值  
                    let [a,b] = [1,2]
                    let {age,name} = {age:'11',name:'aaa'}    
                对象扩展 
                    let obj = {title,run(){}}
                    Object.assgin(obj1,obj2)
                    
               展开运算符
                    数组 对象 展开
                    let arr =[...arr2]  
                    let obj ={...obj2}    

                    Math.max(1,2,3,4)
                    Math.max(...arr)

               rest运算符-获取剩余参数
                   funtion fn(...args){
                     args ->[3,3,4,5]
                   } 
                   fn(3,3,4,5)   
                   
                   
             Symbol 新增的类型 独一无二的值--作用 作为对象的属性名防止属性被修改
             
             set map 数据结构
                   set 类数组-不能重复元素 ，forEach   
                     数组去重 [...new Set(arr)]  Array.from(new Set(arr))
                   map类对象  键 可以是任何类型-一般对象的属性名只能 字符串或者symbol  

          模块化开发
            一个文件就是一个模块，定义定义变量  外部无法直接使用
                导出模块
                   export {aa}  -> import {aa} from '路径'
                   export function box (){}     import {box} from '路径'
                   export default box   import box from '路径'
                导入模块         



         运动
             了解 运动的原理
               运动函数封装--回调函数
               velocity-看文档

               选项卡--轮播图--第二种写法
               swiper -看文档

               留言板--》修改

        面向对象-》  
                   function Dog(){
                        // var this = {}
                        this.name 
                         this.run =function(){}
                        //  return this
                   }
                   let d1 = new Dog()

                   let MyMath = {PI:'aa',run(){}}

              选项卡二->改成了 构成函数      --全局变量-属性  一个个功能-封装函数--方法
                        ps：事件处理函数-写成箭头函数


           正则
              字符串规则的对象
                /aa/ig
                new RegExp('aa','ig') 
                
                test**
                exec 

                search replace  match 

                元符串
                   ^  $
                   * + ? {4} {4,} {4,6}
                   [abc]  [^abc]   [a-z] [A-Z][0-9]  [a-zA-Z0-9_=]
                   \d \D \w \W \s \S .  
                   \.   a|b

                表单校验   


        */
    </script>

</body>

</html>